<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>菜鸟教程(runoob.com)</title>
</head>

<body>

    <div style="opacity:0.5;position:absolute;left:50px;width:300px;height:150px;background-color:#40B3DF"></div>

    <div style="font-family:verdana;padding:20px;border-radius:10px;border:10px solid #EE872A;">

        <div style="opacity:0.3;position:absolute;left:120px;width:100px;height:200px;background-color:#8AC007"></div>

        <h3>Look! Styles and colors</h3>

        <div style="letter-spacing:12px;">Manipulate Text</div>

        <div style="color:#40B3DF;">Colors
            <span style="background-color:#B4009E;color:#ffffff;">Boxes</span>
        </div>

        <div style="color:#000000;">and more...</div>

    </div>

</body>

</html>